<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>与佛论DES的禅</title>
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css">

<!-- Custom styles for this template -->
<link href="css/styles.css" rel="stylesheet">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
<div class="container">
  <div class="starter-template" style="justify-content: center;display: flex;">
    <div class="a">
      <div class="b" style="--i:-30">
        Buddesha
      </div>
      <div class="c" style="--i:30">
        Buddesha
      </div>
      <a href="#" class="d" style="font-family:myFont;">与佛论DES的禅</a>
    </div>
    
  </div>
  <!--error-->
  <div class="row">
    <div class="col-lg-2"></div>
    <div class="col-12 col-lg-8" id="alert">
      <div class="alert alert-danger alert-dismissable hide" id="error-alert" role="alert"> 不可说,不可说,一说即是错 </div>
    </div>
    <div class="col-lg-2"></div>
  </div>
  <!--success-->
  <div class="row">
    <div class="col-lg-2"></div>
    <div class="col-12 col-lg-8" id="alert">
      <div class="alert alert-success alert-dismissable hide" id="copy-alert" role="alert"> 觉了一切法，犹如梦幻响 </div>
    </div>
    <div class="col-lg-2"></div>
  </div>
  <!--main-->
  <div class="row">
    <div class="col-lg-2"></div>
    <div class="col-12 col-lg-8">
      <div class="form-group">
        <textarea class="form-control" id="text-decryped" placeholder="如是我闻：" rows="5"></textarea>
      </div>
    </div>
    <div class="col-lg-2"></div>
  </div>
  <div class="row">
    <div class="col-lg-2"></div>
    <div class="col-12 col-lg-3 leftb">
      <div class="btn-group" role="group" aria-label="Basic example">
        <button type="button" class="btn btn-danger" onClick="encrypt()">
            听佛讲经
        </button>
        <button type="button" class="btn btn-danger" onClick="decrypt()">
            听佛解惑
        </button>
      </div>
    </div>
    <div class="col-12 col-lg-5 button-cen">
      <div class="form-group">
        <input type="password" class="form-control" id="text-key" placeholder="箴言（可选）">
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-lg-2"></div>
    <div class="col-12 col-lg-8">
      <div class="form-group">
        <textarea class="form-control" id="text-encryped" placeholder="佛曰：" rows="7"></textarea>
      </div>
    </div>
    <div class="col-lg-2"></div>
  </div>
  <div class="row lowroe">
    <div class="col-lg-2"></div>
    <div class="col-4 col-lg-2 leftb">
      <button type="button"  class="btn" data-toggle="modal" data-target="#aboutModal">惑从何起</button>
    </div>
    <div class="col-4 col-lg-4"> </div>
    <div class="col-4 col-lg-2 rightb">
      <button type="button"  class="btn" onClick="copyUrl2()">点我复制</button>
    </div>
    <div class="row m-auto">
        <div class="form-inline" >
            <ul>
                <li>
                    <a href="#">
                        <span> Like </span>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <span> Comment </span>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <span> Contact </span>
                    </a>
                </li>
            </ul>
        </div>

  </div>
</div>
<!-- /.container --> 

<!-- Modal -->
<div class="modal fade" id="aboutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">普渡众生</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button>
      </div>
      <div class="modal-body">
        <p>Q：这是什么？</p>
        <p>A：这是一个用DES加密/解密网站，框架来自<a href="https://tools.takuron.top/talk-with-buddha/">Takuron的与佛论禅重制版</a>，并且在其基础上进行了样式修改。</p>
        <p>Q：如何使用？</p>
        <p>A：听佛讲经（加密）：将原文输入在上方输入框，输入箴言（密钥，可选）即可得到佛语（密文）；听佛解惑（解密）：将佛语（密文）输入在上方，输入箴言（可选）即可得到原文。</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-success" data-dismiss="modal">善。</button>
      </div>
    </div>
  </div>
</div>

<!-- Footer -->
<footer class="footer mt-auto py-3">
  <div class="container"> <span class="text-muted">This website has nothing to do with religion.<br>
    Developed by <a href="https://github.com/dafeigy">Dafeigy</a> and open source on <a href="https://github.com/takuron/Buddesha">Github</a>.</span>
</footer>
<script src="js/jquery.slim.min.js" ></script> 
<script src="js/popper.min.js" ></script> 
<script src="js/bootstrap.min.js" ></script> 
<script src="js/crypto-js.min.js"></script> 
<script src="js/main.js"></script>
</body>
</html>
